import 'package:flutter/material.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:qgchat/bloc/blocProvider.dart';
import 'package:qgchat/bloc/shortvideo/focusvideoBloc.dart';
import 'package:qgchat/common/global/global.dart';
import 'package:qgchat/http/models/shortVideoModel.dart';
import 'package:qgchat/widgets/easyRefreshWidget.dart';

class Focuse extends StatefulWidget {
  @override
  _FocuseState createState() => _FocuseState();
}

class _FocuseState extends State<Focuse> {
  @override
  Widget build(BuildContext context) {
    return BlocProvider<Focusbloc>(
      bloc: Focusbloc(),
      child: Singervideo(),
    );
  }
}

class Singervideo extends StatelessWidget {
  // 单个小视频
  Widget getItemContainer(content, item) {
    if (item.paymoney > 0) {
      return GestureDetector(
        onTapUp: (val) {
          goPage(content, '/innervideo', param: {'id': item.id,'image':item.thumbnail});
        },
        child: Container(
          width: px(334),
          height: px(445),
          decoration: ShapeDecoration(
            image: DecorationImage(
              image: NetworkImage("${item.thumbnail}"),
              fit: BoxFit.cover,
            ),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadiusDirectional.circular(12),
            ),
          ),
          child: Stack(
            children: <Widget>[
              Positioned(
                top: px(15),
                right: px(16),
                child: Container(
                  width: px(94),
                  height: px(38),
                  decoration: BoxDecoration(
                    border: Border.all(width: px(1), color: Colors.white),
                    borderRadius: BorderRadius.all(
                      Radius.circular(
                        px(19),
                      ),
                    ),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: <Widget>[
                      Image.asset(
                        'assets/images/icon/whitestar.png',
                        width: px(26),
                        height: px(25),
                      ),
                      Container(
                          child: Text(
                        '付费',
                        style: TextStyle(
                          fontSize: px(22),
                          color: Colors.white,
                        ),
                      )),
                    ],
                  ),
                ),
              ),
              Positioned(
                bottom: px(15),
                left: px(10),
                child: Container(
                  width: px(94),
                  height: px(38),
                  decoration: BoxDecoration(
                    color: Color.fromRGBO(255, 255, 255, 0.8),
                    border: Border.all(width: px(1), color: Colors.white),
                    borderRadius: BorderRadius.all(
                      Radius.circular(
                        px(19),
                      ),
                    ),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: <Widget>[
                      Image.asset(
                        'assets/images/icon/heart_red.png',
                        width: px(20),
                        height: px(19),
                      ),
                      Container(
                          child: Text(
                        '${item.watch}',
                        style: TextStyle(
                          fontSize: px(22),
                          color: Colors.red,
                        ),
                      )),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      );
    } else {
      return GestureDetector(
        onTapUp: (val) {
          goPage(content, '/innervideo', param: {'id': item.id,'image':item.thumbnail});
        },
        child: Container(
          width: px(334),
          height: px(445),
          decoration: ShapeDecoration(
            image: DecorationImage(
              image: NetworkImage("${item.thumbnail}"),
              fit: BoxFit.cover,
            ),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadiusDirectional.circular(12),
            ),
          ),
          child: Stack(
            children: <Widget>[
              Positioned(
                bottom: px(15),
                left: px(10),
                child: Container(
                  width: px(94),
                  height: px(38),
                  decoration: BoxDecoration(
                    color: Color.fromRGBO(255, 255, 255, 0.8),
                    border: Border.all(width: px(1), color: Colors.white),
                    borderRadius: BorderRadius.all(
                      Radius.circular(
                        px(19),
                      ),
                    ),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: <Widget>[
                      Image.asset(
                        'assets/images/icon/heart_red.png',
                        width: px(20),
                        height: px(19),
                      ),
                      Container(
                          child: Text(
                        '${item.watch}',
                        style: TextStyle(
                          fontSize: px(22),
                          color: Colors.red,
                        ),
                      )),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    Focusbloc bloc = BlocProvider.of<Focusbloc>(context);
    return StreamBuilder(
      stream: bloc.callStream,
      builder: (
        BuildContext context,
        AsyncSnapshot snapshot,
      ) {
        List<ShortVideoModel> list = snapshot.data;
        if (snapshot.hasData) {
          if (list.isNotEmpty) {
            return Container(
              color: Colors.white,
              child: EasyRefresh(
                header: EasyRefreshSetting.header,
                footer: EasyRefreshSetting.footer,
                onRefresh: () async {
                  bloc.onRefresh();
                },
                onLoad: () async {
                  bloc.onLoad();
                },
                child: GridView.count(
                  //水平子Widget之间间���
                  crossAxisSpacing: px(22),
                  //垂直子Widget之间间距
                  mainAxisSpacing: px(22),
                  //GridView内边距
                  padding:
                      EdgeInsets.only(left: px(30), right: px(30), top: px(20)),
                  //一行的Widget数量
                  crossAxisCount: 2,
                  childAspectRatio: 0.75,
                  //子Widget列表
                  children: list.map<Widget>((f) {
                    return getItemContainer(context, f);
                  }).toList(),
                ),
              ),
            );
          } else {
            return Container();
          }
        } else {
          return Container();
        }
      },
    );
  }
}
